HTML 部份元素會有預設的觸發行為，像是 的連結、表單的 submit
若是需要在這些元素綁定事件，讓指定的元素可以執行指定的程式碼
那就得取消 HTML 預設的觸發行為

• 情境：點選連結後，在 console 要顯示 nya 的字樣

<a href="https://www.google.com">Google 連結</a>

const isLink = document.querySelector('a');  // 選到 a 標籤

isLink.addEventListener('click',function(e){
  console.log('Nya');
});

在連結上綁定的 click 事件，但點選時還是會連結到指定的地方
此時就需要使用取消 HTML 觸發行為

使用 event.preventDefault() 來取消預設的觸發行為

<a href="https://www.google.com">Google 連結</a>

const isLink = document.querySelector('a');  // 選到 a 標籤

isLink.addEventListener('click',function(e){
  e.preventDefault();
  console.log('Nya');
});

結果

使用 event.preventDefault() 就會把預設行為取消

參考資料及學習資源

• 0 陷阱！0 誤解！8 天重新認識 JavaScript！
• JavaScript 指南
• 六角學院 - JavaScript 必修篇 - 前端修練全攻略

本日小節

今天簡單介紹怎麼取消 HTML 預設行為
有任何問題都歡迎傳訊息給我
這是我的學習紀錄，我們下次見~